<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>练习</title>
    <style>
        * {
            margin: 0;
        }
    </style>
</head>
<body>
<h4>1、js数组不是典型的数组:</h4>
<ul>
    <li>典型数组：1、元素类型相同 2、内存连续 3、通过数字下标获取元素</li>
    <li>js数组：1、元素类型可不同 2、内存可不连续(存放顺序也是随机) 3、通过字符串下标获取元素</li>
</ul>
<h4>2、js数组的创建</h4>
<h5>2.1、新建:</h5>
<ul>
    <li>let arr=[1,2,3] //简写</li>
    <li>let arr=new Array(1,2,3) //1，2，3是元素</li>
    <li>let arr=new Array(8) //8是长度</li>
</ul>
<h5>2.2、转化:</h5>
<ul>
    <li>let arr = '1，2，3'.split(','); let arr ='123'.split('')</li>
    <li>Array.from('123') // 支持数字字符串，以及伪数组(含下标和length属性)</li>
</ul>
<h5>2.3、伪数组:</h5>
<ul>
    <li>伪数组的原型链中没有数组的原型</li>
    <li>let divList = document.querySelector("li")</li>
</ul>
<h5>2.4、合并:</h5>
<ul>
    <li>arr1.concat(arr2) // arr1和arr2合并后生成新数组，不影响原来的arr1和arr2</li>
</ul>
<h5>2.5、截取:</h5>
<ul>
    <li>arr1.slice(0) // 从下标为0的地方开始切，返回切点及以后的内容，不影响原数组；提示slice(0)可以复制数组</li>
</ul>
<h4>3、增删改查</h4>
<h5>3.1、增加元素</h5>
<h6>3.1.1、对象的方法(不推荐)</h6>
<ul>
    <li>arr[100]=673 //数组长度直接变为101了</li>
</ul>
<h6>3.1.2、数组方式</h6>
<ul>
    <li>arr.push(x,y,z ...) //修改arr，返回新长度</li>
    <li>arr.unshift(x,y,z ...) //修改arr，返回新长度</li>
    <li>arr.splice(2,0,1,673) //下标2的位置删除0个元素并开始将1，673加入进去</li>
</ul>
<h5>3.2、删除元素</h5>
<h6>3.2.1、对象的方法(不推荐)</h6>
<ul>
    <li>对象删法：delete arr['0'] //若原来[2,1],操作后[empty,1] 是删了，但长度居然不变</li>
    <li>改length：arr.length=1 //若原来[2,1],操作后[2] 是删了,但不建议</li>
</ul>
<h6>3.2.2、数组方式</h6>
<ul>
    <li>arr.shift() // 删除开头第一个，同时长度变短</li>
    <li>arr.pop() //删除最后一个，同时长度变短</li>
    <li>arr.splice(2,3) //下标2的位置删除3个元素</li>
    <li>arr.splice(2,1,x) //下标2的位置删除1个元素改成x</li>
    <li>arr.splice(2,1,1,673) //下标2的位置删除1个元素并开始将1，673加入进去</li>
</ul>
<h5>3.3、改元素</h5>
<h6>3.3.1、数组常规修改</h6>
<ul>
    <li>arr.splice(2,1,8)//下标2的位置删除1个元素,改为8</li>
    <li>arr[1]=5</li>
</ul>
<h6>3.3.2、数组修改</h6>
<ul>
    <li>arr.reverse() // 数组反转</li>
    <li>arr.sort() // 数组排序，默认从小到大</li>
</ul>
<h5>3.4、查元素</h5>
<h6>3.4.1、对象的方法(不推荐)</h6>
<ul>
    <li>Object.keys(arr) // 数组中不符合我们对数组认知的元素也会一起返回</li>
    <li>Object.values(arr) // 数组中不符合我们对数组认知的元素也会一起返回</li>
    <li>for(let i in arr){console.log(i)} // 数组中不符合我们对数组认知的元素也会一起返回</li>
</ul>
<h6>3.4.2、数组遍历的方法</h6>
<ul>
    <li>for 循环遍历借助arr.length // for循环有break、continue 块级作用域</li>
    <li>forEach方法 // 函数作用域</li>
</ul>
<h6>3.4.3、查单个</h6>
<ul>
    <li>arr['下标'],若读取不存在的下标得到undefined</li>
    <li>arr.index(item) // 有就item元素返回下标，找不到就返回-1</li>
</ul>
<script src="js/main.js"></script>
</body>
</html>